<template>
  <el-row :gutter="15" class="head">
    <el-form
      ref="queryParams"
      :model="queryParams"
      size="mini"
      label-width="100px"
      label-position="left"
    >
      <el-col :span="24">
        <el-row :gutter="15">
          <el-col :span="6" :offset="2">
            <el-form-item label="办案单位名称" prop="peName">
              <el-input v-model="queryParams.name" placeholder="请输入办案单位名称" clearable />
            </el-form-item>
          </el-col>
          <el-col :span="6" :offset="2">
            <el-form-item label="办案单位地址" prop="pName">
              <el-input v-model="queryParams.address" placeholder="请输入财物名称" clearable />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="15">
          <el-col :span="6" :offset="2">
            <el-form-item label="">
              <!-- 办案单位图片 -->
              <!-- <image-upload v-model="queryParams.img_url" />
              <el-dialog :visible.sync="dialogVisible">
                <img width="50%" :src="dialogImageUrl" alt="" />
              </el-dialog> -->
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="15">
          <el-col :span="2" :offset="12">
            <el-form-item size="large">
              <el-button class="da" type="primary" @click="add">新增</el-button>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item size="large">
              <el-button type="primary" @click="handleQuery">搜索</el-button>
            </el-form-item>
          </el-col>
           <el-col :span="4">
            <el-form-item size="large">
              <el-button  type="primary" @click="resetQuery">重置</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-col>
    </el-form>
  </el-row>
</template>
<script>
import request from '@/utils/request.js'
export default {
  naem: 'FormData',
  components: {},
  props: {
    // 是否显示'处理列表'按钮
    register: {
      type: Boolean,
      default: true
    },
    // '处理列表'按钮名称
    buttonName: {
      type: String,
      default: '登记处置'
    },
     // 页数
    pageNum: {
      type: Number,
      default: 1
    },
    // 页大小
    pageSize: {
      type: Number,
      default: 5
    }
  },
  data() {
    return {
      dialogVisible: false,
      dialogImageUrl: false,
      // 仓库列表
      depotList: [],
      // 查询参数
      queryParams: {
        id: null,
        name: null,
        img_url: null,
        create_by: null,
        create_time: null,
        update_by: null,
        pCreupdate_timeateTime: null,
        remark: null,

      }
    }
  },
  methods: {
    registerDispose() {
      this.$emit('registerDispose')
    },
    // 新增
    add() {
      this.$emit('add', this.queryParams)
    },
    // 搜索
    handleQuery() {
      this.$emit('handleQuery', {
        ...this.queryParams,
        pageNum: this.pageNum,
        pageSize: this.pageSize
      })
    },
     resetQuery() {
      for (const key in this.queryParams) {
        this.queryParams[key] = null
      }
      this.handleQuery()
    },
   
  }
}
</script>
<style scoped>
.app-container {
  padding: 15px;
}
</style>
